<template>
  <div class="page_root">
    <div class="page_left">
      <tabs-drawer :drawerList="drawerList" :currentIndex="currentIndex" @change="changeIndex">
      </tabs-drawer>
    </div>
    <div class="page_right">
      <div v-show="currentIndex === 0">
        <home-config ref="softupgrade"></home-config>
      </div>
      <div v-show="currentIndex === 1">
        <organization ref="systeminfo"></organization>
      </div>
    </div>
  </div>
</template>

<script>
import TabsDrawer from "@/components/TabsDrawer/index.vue";
import HomeConfig from "./subcomponents/HomeConfig.vue"
import Organization from "./subcomponents/Organization.vue"


export default {
  components: {
    TabsDrawer,
    
    HomeConfig,
    Organization
  },
  data() {
    return {
      drawerList: [
        {
          index: 0,
          name: "首页展示设置",
        },
        {
          index: 1,
          name: "党建选项名称设置",
        },
      ],
      currentIndex: 0,
    };
  },
  methods: {
    loadData() {

      if (this.currentIndex === 0) {
        this.$refs.softupgrade.loadData();
      } else if (this.currentIndex === 1) {
        this.$refs.systeminfo.loadData();
      }
      else if (this.currentIndex === 2) {
        this.$refs.cloudconfiguration.loadData();
      }
      else if (this.currentIndex === 3) {
        this.$refs.logdownload.loadData();
      }
      else if (this.currentIndex === 4) {
      }
    },

    changeIndex(index) {
      this.currentIndex = index;
      this.loadData();
    },
  },
};
</script>

<style lang="scss" scoped>
.page_root {
  display: flex;
  height: 100%;

  .page_right {
    flex: 1;

    &>div {
      height: 100%;
      width: 100%;
    }
  }
}
</style>